Ext.define('qjtravel.view.Product', {
    extend: 'Ext.Panel',
    xtype: 'product',
    requires: [
        'Ext.List', 'Ext.TitleBar', 'Ext.plugin.PullRefresh', 'Ext.plugin.ListPaging'
    ],
    config: {
        layout: 'card',
        cls:"dv",
        items: [
            {
                xtype: 'toolbar',
                id: 'toolbar',
                ui: 'dark',
                docked: 'top',
                title: '',
                items: [
                    {
                        xtype: 'button',
                        id: 'back',
                        text: '返回',
                        listeners: {
                            tap: function (pro) {
                                window.localStorage.removeItem("homeClick");
                                Ext.Viewport.remove(this.up('product'), true);
                            }
                        }
                    },
                    {xtype: 'spacer'}
                    ,
                    {
                        xtype: 'button',
                        align: 'right',
                        id: 'map',
                        text: '地图',
                        handler: function () {
                            var product = Ext.getStore('Product')

                            var popmap = Ext.create('qjtravel.view.PopMap');
                            Ext.Viewport.animateActiveItem(popmap, {type: 'slide', direction: 'left'});
                            var adds = [];
                            var length = product.getData().length;
                            for (var i = 0; i < length; i++) {
                                if (i > 9)break;
                                adds.push(product.getData().getAt(i).data.name);
                            }
                            popmap.search(adds);
                        }
                    }
                ]
            },
            {
                xtype: 'dataview',
                store: 'Product',
                id: 'select',
                emptyText: '未添加旅游栏目'
            }
        ],
        listeners: {
            painted: function () {
                Ext.Viewport.unmask();
            },
            back: function () {
                window.localStorage.removeItem("homeClick");
                Ext.Viewport.remove(Ext.Viewport.getActiveItem(), true);
            },
            initialize: function (list) {
                var bodyW = document.body.clientWidth;
                var imgW = bodyW * 0.25;
                var imgH = imgW * 0.7;
                var styleStr = "float:left;width:" + imgW + "px;height:" + imgH + "px";
                var baseParam = bodyW > 599 ? 0.8 : 0.4;
                var styleStrDate = "line-height:" + (imgH * baseParam) + "px;height: " + (imgH * 0.5) + "px;text-align: right;"
                Ext.getCmp("select").setItemTpl("<tpl if='ccid==13'>" +
                    "<div style='height: " + imgH + "px; position: relative'>" +
                    "<img src='{picurl}' style='" + styleStr + "' class='radius1'/>" +
                    "<div class='font1 color2 travelName' style='width: 60%;padding-left: 10px; overflow: hidden;'>{name}</div>" +
                    "<div class='font3' style='color: #7c0303;line-height:14px;height: 22px; top:0px; position: absolute; right: 15px;'>" +
                    "<tpl if='meanPrice==0'>免费" +
                    "<tpl else>{meanPrice}￥</tpl> " +
                    "</div>" +
                    "<div class='font3 color2' style='line-height:28px;height: 2.5em; padding-left: 10px; padding-right: 20px; overflow: hidden'>开闭园时间：{term}</div>" +
                    "</div>" +
                    "<tpl elseif='ccid==15'>" +
                    "<div style='height: " + imgH + "px'>" +
                    "<img src='{picurl}' style='" + styleStr + "' class='radius1'/>" +
                    "<div class='news_title font1 color2'>{name}</div>" +
                    "<tpl if='meanPrice!=\"\"'>" +
                    "<div class='news_date font3 color1' style='" + styleStrDate + "'>人均消费：{meanPrice}元</div>" +
                    "<tpl else>" +
                    "<div class='news_date font3 color1'>&nbsp;</div>" +
                    "</tpl>" +
                    "</div>" +
                    "<tpl elseif='ccid==16'>" +
                    "<div style='height: " + imgH + "px'>" +
                    "<img src='{picurl}'  style='" + styleStr + "'  class='radius1'/>" +
                    "<div class='news_title font1 color2'>{name}</div>" +
                    "<tpl if='meanPrice!=\"\"'>" +
                    "<div class='news_date font3 color1'>{meanPrice}元起</div>" +
                    "<tpl else>" +
                    "<div class='news_date font3 color1'>&nbsp;</div>" +
                    "</tpl>" +
                    "</div>" +
                    "<tpl else>" +
                    "<div style='height: " + imgH + "px'>" +
                    "<img src='{picurl}' style='" + styleStr + "'  class='radius1'/>" +
                    "<div class='news_title font1 color2'>{name}</div>" +
                    "</div>" +
                    "</tpl>");
            }
        }
    }
});
